<template>
  <div class="container">
    <div class="rect"></div>
    <div class="circle"></div>
  </div>
</template>

<script setup>

</script>

<style scoped lang="scss">
.container{
  width: 800px;
  height:400px;
  margin:100px auto;
  background: #ddd;
  position: relative;
  .rect{
    width: 150px;
    height:20px;
    background: red;
    position: absolute;
    top:230px;
    left:75px;
    transform-origin: center;
    transform: translate(-50%,-50%) rotate(0deg);
  }
  .circle{
    width: 20px;
    height:20px;
    background: yellow;
    position: absolute;
    top:230px;
    left:200px;
    transform: translate(-50%,-50%);
    border-radius: 50%;
  }
}
</style>